﻿<!DOCTYPE HTML>
<!--[if IEMobile 7]>
  <html class="no-js iem7 oldie linen"/>
  <![endif]-->
<!--[if (IE 7)&!(IEMobile)]>
    <html class="no-js ie7 oldie linen" lang="en"/>
    <![endif]-->
<!--[if (IE 8)&!(IEMobile)]>
      <html class="no-js ie8 oldie linen" lang="en"/>
      <![endif]-->
<!--[if (IE 9)&!(IEMobile)]>
        <html class="no-js ie9 linen" lang="en"/>
        <![endif]-->
<!--[if (gt IE 9)|(gt IEMobile 7)]>
          <!-->
<html class="no-js linen" lang="es">
<!--<![endif]-->

<head>
<meta charset="utf-8"/>
<meta name="robots" content="index" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
<title>Inventario SaaS</title>
<meta name="description" content="Inventario"/>
<meta name="author" content="Marlon Zayro Arias Vargas"/>
<!-- http://davidbcalhoun.com/2010/viewport-metatag -->
<meta name="HandheldFriendly" content="True"/>
<meta name="MobileOptimized" content="320"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
<!-- For all browsers -->
<link rel="stylesheet" href="plantilla/css/reset.css"/>
<link rel="stylesheet" href="plantilla/css/style.css"/>
<link rel="stylesheet" href="plantilla/css/colors.css"/>
<link rel="stylesheet" media="print" href="plantilla/css/print.css"/>
<!-- For progressively larger displays -->
<link rel="stylesheet" media="only all and (min-width: 480px)" href="plantilla/css/480.css"/>
<link rel="stylesheet" media="only all and (min-width: 768px)" href="plantilla/css/768.css"/>
<link rel="stylesheet" media="only all and (min-width: 992px)" href="plantilla/css/992.css"/>
<link rel="stylesheet" media="only all and (min-width: 1200px)" href="plantilla/css/1200.css"/>
<!-- For Retina displays -->
<link href="plantilla/css/2x.css" rel="stylesheet" type="text/css" media="only all and (-webkit-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (min-device-pixel-ratio: 1.5)"/>
<!-- Additional styles -->
<link rel="stylesheet" href="plantilla/css/styles/form.css"/>
<link rel="stylesheet" href="plantilla/css/styles/switches.css"/>
<link rel="stylesheet" href="plantilla/css/styles/modal.css?v=1">
<link rel="stylesheet" href="plantilla/css/styles/progress-slider.css?v=1">
<!-- Login pages styles -->
<link rel="stylesheet" media="screen" href="plantilla/css/login.css"/>
<!-- JavaScript at bottom except for Modernizr -->
<script src="plantilla/js/libs/modernizr.custom.js">            </script>
<!-- For Modern Browsers -->
<link rel="shortcut icon" href="plantilla/img/favicons/favicon.png"/>
<!-- For everything else -->
<link rel="shortcut icon" href="plantilla/img/favicons/favicon.ico"/>
<!-- For retina screens -->
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="plantilla/img/favicons/apple-touch-icon-retina.png"/>
<!-- For iPad 1-->
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="plantilla/img/favicons/apple-touch-icon-ipad.png"/>
<!-- For iPhone 3G, iPod Touch and Android -->
<link rel="apple-touch-icon-precomposed" href="plantilla/img/favicons/apple-touch-icon.png"/>
<!-- iOS web-app metas -->
<meta name="apple-mobile-web-app-capable" content="yes"/>
<meta name="apple-mobile-web-app-status-bar-style" content="black"/>
<!-- Startup image for web apps -->
<link rel="apple-touch-startup-image" href="plantilla/img/splash/ipad-landscape.png" media="screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape)"/>
<link rel="apple-touch-startup-image" href="plantilla/img/splash/ipad-portrait.png" media="screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait)"/>
<link rel="apple-touch-startup-image" href="plantilla/img/splash/iphone.png" media="screen and (max-device-width: 320px)"/>
<!-- Microsoft clear type rendering -->
<!--<meta http-equiv="cleartype" content="on"/>-->
<!-- IE9 Pinned Sites: http://msdn.microsoft.com/en-us/library/gg131029.aspx -->
<!--<meta name="application-name" content="Developr Admin Skin"/>
            <meta name="msapplication-tooltip" content="Cross-platform admin template."/>
            <meta name="msapplication-starturl" content="http://www.display-inline.fr/demo/developr"/>-->
<!-- These custom tasks are examples, you need to edit them to show actual pages -->
<!--<meta name="msapplication-task" content="name=Agenda;action-uri=http://www.display-inline.fr/demo/developr/agenda.html;icon-uri=http://www.display-inline.fr/demo/developr/img/favicons/favicon.ico"/>
            <meta name="msapplication-task" content="name=My profile;action-uri=http://www.display-inline.fr/demo/developr/profile.html;icon-uri=http://www.display-inline.fr/demo/developr/img/favicons/favicon.ico"/>-->

<style>
.titulo {
	color: #666;
	text-align: center;
}
input[title] {
}

@font-face{
   font-family:"Almendra";
   src:url(fuentes/Codystar%20regular.ttf);
}
.titulo{
   font-family:Almendra;
}


.subtitulo{
   font-family:Almendra;
}
</style>

</head>

<body>
<div id="container">
  <hgroup id="login-title" class="large-margin-bottom">
    <h1 class="titulo"> Inventario SaaS </h1>
    <h5 class="subtitulo"> Inventarios &copy; 2014 </h5>
    
  </hgroup>
  <!-- The autocomplete="off" attributes is the only way to prevent webkit browsers from filling the inputs with yellow -->
  <form id="form-login" name="loginform" method="POST" action="componentes/libreria_php/controlador/usuarios_bd.php">
    <ul class="inputs black-input large">
      <li> <span class="icon-user mid-margin-right"></span>
        <input name="entrada[]" class="input-unstyled" type="text" id="login" title="Usuario"  placeholder="Usuario" autocomplete="off"/>
      </li>
      <li> <span class="icon-lock mid-margin-right"> </span>
        <input name="entrada[]" class="input-unstyled" type="password" id="pass" title="Clave" placeholder="Clave" autocomplete="off"/>
      </li>
    </ul>

    <button type="submit" class="button glossy full-width huge"> Ingreso </button>
  </form>
  <p>&nbsp;</p>
  <a   href="javascript:openModal()" class="button grey-gradient" title="Nuevo Usuario">Nuevo Usuario</a> <a href="javascript:recuperar_password()" class="button grey-gradient" title="Recuperar Clave"  >Recuperar password</a> </div>

<!-- JavaScript at the bottom for fast page loading --> 
<!-- Scripts --> 
<script src="plantilla/js/libs/jquery-1.8.2.min.js">  </script> 
<script src="plantilla/js/setup.js">  </script> 

<!-- Template functions --> 
<script src="plantilla/js/developr.input.js"></script> 
<script src="plantilla/js/developr.message.js"></script> 
<script src="plantilla/js/developr.notify.js"></script> 
<script src="plantilla/js/developr.modal.js"></script> 
<script src="plantilla/js/developr.confirm.js"></script>




<script>



function autenticar(correos, emails)
{

	$.post('componentes/libreria_php/controlador/usuarios_verificar.php', {
		correo: correos,
		email: emails
	
	}, function(data)
	{
		console.log(data);
				openAlert(data.estado_consulta);
	}, "json").done(function(data)
	{
		//console.log(data);
	}) .error(function(data, status, readyState, responseText) {
    console.error("Error login: " + data.status);
    console.error("Error login: " + data.readyState);
    console.error("Error login: " + data.responseText);
  });
}
          
              $(document).ready(function() {
/*
	 * JS login effect
	 * This script will enable effects for the login page
	 */
                // Elements
                var doc = $('html').addClass('js-login'),
                    container = $('#container'),
                    formLogin = $('#form-login'),
                    
                    
                    
                    
                    // If layout is centered
                    
                    centered;

                /******* EDIT THIS SECTION *******/

/*
	 * AJAX login
	 * This function will handle the login process through AJAX
	 */
                formLogin.submit(function(event) {
                  // Values
                  var login = $.trim($('#login').val()),
                      pass = $.trim($('#pass').val());

                  // Check inputs
                  if (login.length === 0) {
                    // Display message
                    displayError('Por favor, rellene sus datos de acceso');
                    return false;
                  } else if (pass.length === 0) {
                    // Remove empty login message if displayed
                    formLogin.clearMessages('Por favor, rellene su clave de acceso');

                    // Display message
                    displayError('Por favor, introduzca su contraseña');
                    return false;
                  } else {
                    // Remove previous messages
                    formLogin.clearMessages();

                    // Show progress
                    displayLoading('Verificando Datos...');
                    //	event.preventDefault();

                    // Stop normal behavior
                    event.preventDefault();


                    // This is where you may do your AJAX call, for instance:
                    $.ajax({
                      type: 'POST',
                      dataType: "json",
                     // url: 'componentes/libreria_php/controlador/usuarios_bd.php',
                      url: $(this).attr('action'),
                      data: $(this).serialize(),

                      success: function(data) {
						//console.log(data);
						

						
                        if (data.info == "exitoso") {

                          // Simulate server-side check
						  

							localStorage.clear();  

localStorage.setItem('nombres', data.nombres);
localStorage.setItem('apellidos', data.apellidos);

							
var cifrar_grupo = $.post('componentes/libreria_php/encode.php', {cifrar: data.grupo});
var cifrar_privilegio = $.post('componentes/libreria_php/encode.php', {cifrar: data.privilegio});
  
 
 cifrar_grupo.done(function( data ) {
localStorage.setItem('grupo', data);
    });
	
 
 cifrar_privilegio.done(function( data ) {
localStorage.setItem('privilegio', data);
    });
	
						  
						
					
						
						

						
						
                          setTimeout(function() {         document.location.href = 'inicio.php'                          }, 1000);

                        } else {
						localStorage.clear();
                          formLogin.clearMessages();
                          displayError('Válido de usuario / contraseña, por favor inténtalo de nuevo');
                        }
                      },
                      error: function(data) {
  console.log(data);
                        formLogin.clearMessages();
                        displayError('Error al contactar con el servidor, por favor inténtalo de nuevo');
                      }
                    });



                  }
                });

                /******* END OF EDIT SECTION *******/

                // Handle resizing (mostly for debugging)

                function handleLoginResize() {
                  // Detect mode
                  centered = (container.css('position') === 'absolute');

                  // Set min-height for mobile layout
                  if (!centered) {
                    container.css('margin-top', '');
                  } else {
                    if (parseInt(container.css('margin-top'), 10) === 0) {
                      centerForm(false);
                    }
                  }
                };

                // Register and first call
                $(window).bind('normalized-resize', handleLoginResize);
                handleLoginResize();

/*
	 * Center function
	 * @param boolean animate whether or not to animate the position change
	 * @param string|element|array any jQuery selector, DOM element or set of DOM elements which should be ignored
	 * @return void
	 */

                function centerForm(animate, ignore) {
                  // If layout is centered
                  if (centered) {
                    var siblings = formLogin.siblings(),
                        finalSize = formLogin.outerHeight();

                    // Ignored elements
                    if (ignore) {
                      siblings = siblings.not(ignore);
                    }

                    // Get other elements height
                    siblings.each(function(i) {
                      finalSize += $(this).outerHeight(true);
                    });

                    // Setup
                    container[animate ? 'animate' : 'css']({
                      marginTop: -Math.round(finalSize / 2) + 'px'
                    });
                  }
                };

                // Initial vertical adjust
                centerForm(false);

                /**
                 * Function to display error messages
                 * @param string message the error to display
                 */

                function displayError(message) {
                  // Show message
                  var message = formLogin.message(message, {
                    append: false,
                    arrow: 'bottom',
                    classes: ['red-gradient'],
                    animate: false // We'll do animation later, we need to know the message height first
                  });

                  // Vertical centering (where we need the message height)
                  centerForm(true, 'fast');

                  // Watch for closing and show with effect
                  message.bind('endfade', function(event) {
                    // This will be called once the message has faded away and is removed
                    centerForm(true, message.get(0));

                  }).hide().slideDown('fast');
                }

                /**
                 * Function to display loading messages
                 * @param string message the message to display
                 */

                function displayLoading(message) {
                  // Show message
                  var message = formLogin.message('<strong>' + message + '</strong>', {
                    append: false,
                    arrow: 'bottom',
                    classes: ['blue-gradient', 'align-center'],
                    stripes: true,
                    darkStripes: false,
                    closable: false,
                    animate: false // We'll do animation later, we need to know the message height first
                  });

                  // Vertical centering (where we need the message height)
                  centerForm(true, 'fast');

                  // Watch for closing and show with effect
                  message.bind('endfade', function(event) {
                    // This will be called once the message has faded away and is removed
                    centerForm(true, message.get(0));

                  }).hide().slideDown('fast');
                }
              });

              // What about a notification?
              	notify('Software de Inventario',
' Bienvenido <a href="login-box.html"/><b>box version</b></a> or the <a href="login-full.html"/><b>full version</b></a>.',
 {
              	autoClose: false,
              	delay: 200,
              	icon: 'plantilla/img/demo/icon.png'
              });
              

  /* ... mensajes de alert ...*/


	
// Delete button
$('.list .button-group a:last-child').data('confirm-options', {

	onShow: function()
	{
// Remove auto-hide class
$(this).parent().removeClass('show-on-parent-hover');
	},

	onConfirm: function()
	{
// Remove element
$(this).closest('li').fadeAndRemove();

// Prevent default link behavior
return false;
	},

	onRemove: function()
	{
// Restore auto-hide class
$(this).parent().addClass('show-on-parent-hover');
	}

});

// Demo modal
function openModal()
{
	$.modal({
content: '<div class="standard-tabs same-height">'+

'<form name="formulario_registro_usuario" id="registro_usuario" action="componentes/libreria_php/controlador/usuarios_autenticacion.php"   method="post" >'+

'<p class="button-height inline-label">'+

	'<label for="validation-required" class="label">Usuario</label>'+
	
'<input type="text" name="usuario" id="validation-required" class="input validate[required]" value="" data-tooltip-options=\'{"position":"right"}\'>'+

'</p>'+

'<p class="button-height inline-label">'+

	'<label for="validation-email" class="label">Email</label>'+
	
	'<input type="text" name="correo" id="validation-email" class="input validate[required,custom[email]]" placeholder="Email@example.com" onchange="autenticar(this.value, \'\')" >'+
	
'</p>'+

'<p class="button-height inline-label">'+

	'<label for="validation-length" class="label">Clave</label>'+
	
	'<input type="text" name="clave" id="validation-length" class="input validate[required,minSize[6]]" >'+	

	'<p>&nbsp;</p>'+
	'<button type="button" class="button blue-gradient"  name="enviar" value="enviar" style="width:50%;" >Enviar</button>'+
'</p>'+
	'</form>'+
'</div>',
title: 'Nuevo Usuario',	
width: 300,
scrolling: false,
actions: {
	'Cerrar' : {
color: 'red',
click: function(win) { win.closeModal(); }
	}
},
buttons: {
	
},
buttonsLowPadding: true
	});

};


	function recuperar_password()
{
	$.modal({
content: '<div class="standard-tabs same-height">'+

'<form name="formulario_registro_usuario" id="registro_usuario" action="componentes/libreria_php/controlador/usuarios_recuperar_clave.php"   method="post" >'+

	  
'<p class="button-height inline-label">'+

'<label for="validation-email" class="label">Email</label>'+
	
'<input type="text" name="emails" id="validation-email" class="input validate[required,custom[email]]" placeholder="Email@example.com"  >'+

'<button type="button" class="button blue-gradient"  name="enviar" value="enviar" style="width:50%;" onclick="autenticar(\'\', this.value)" >Enviar</button>'+	
'</p>'+


	
	'</form>'+
	'</div>',
	
title: 'Recuperar Password',
	
width: 300,
scrolling: false,
actions: {
	'Cerrar' : {
color: 'red',
click: function(win) { win.closeModal(); }
	}
},
buttons: {
//	'Cerrar': {classes:	'huge blue-gradient glossy full-width',click:function(win) { win.closeModal(); }	}
},
buttonsLowPadding: true
	});
};


// Demo alert
function openAlert(mensaje)
{
	$.modal.alert(''+mensaje+'', {
buttons: {
	'Cerrar': {
classes:	'huge blue-gradient glossy full-width',
click:function(win) { 
win.closeModal();
}}} 
});
};

// Demo prompt
function openPrompt()
{
	var cancelled = false;

	$.modal.prompt('Please enter a value between 5 and 10:', function(value)
	{
value = parseInt(value);
if (isNaN(value) || value < 5 || value > 10)
{
	$(this).getModalContentBlock().message('Please enter a correct value', { append: false, classes: ['red-gradient'] });
	return false;
}

$.modal.alert('Value: <strong>'+value+'</strong>');

	}, function()
	{
if (!cancelled)
{
	$.modal.alert('Oh, come on....');
	cancelled = true;
	return false;
}
	});
};

// Demo confirm
function openConfirm()
{
	$.modal.confirm('Challenge accepted?', function()
	{
$.modal.alert('Me gusta!');

	}, function()
	{
$.modal.alert('Meh.');
	});
};

/*
 * Agenda scrolling
 * This example shows how to remotely control an agenda. most of the time, the built-in controls
 * using headers work just fine
 */

	// Days





// Demo loading modal
function openLoadingModal()
{
	var timeout;

	$.modal({
contentAlign: 'center',
width: 240,
title: 'Loading',
content: '<div style="line-height: 25px; padding: 0 0 10px"><span id="modal-status">Contacting server...</span><br><span id="modal-progress">0%</span></div>',
buttons: {},
scrolling: false,
actions: {
	'Cancel': {
color:	'red',
click:	function(win) { win.closeModal(); }
	}
},
onOpen: function()
{
// Progress bar
	var progress = $('#modal-progress').progress(100, {
	size: 200,
	style: 'large',
	barClasses: ['anthracite-gradient', 'glossy'],
	stripes: true,
	darkStripes: false,
	showValue: false
}),

// Loading state
loaded = 0,

// Window
win = $(this),

// Status text
status = $('#modal-status'),

// Function to simulate loading
simulateLoading = function()
{
	++loaded;
	progress.setProgressValue(loaded+'%', true);
	if (loaded === 100)
	{
progress.hideProgressStripes().changeProgressBarColor('green-gradient');
status.text('Done!');
/*win.getModalContentBlock().message('Content loaded!', {
	classes: ['green-gradient', 'align-center'],
	arrow: 'bottom'
});*/
setTimeout(function() { win.closeModal(); }, 1500);
	}
	else
	{
if (loaded === 1)
{
	status.text('Loading data...');
	progress.changeProgressBarColor('blue-gradient');
}
else if (loaded === 25)
{
	status.text('Loading assets (1/3)...');
}
else if (loaded === 45)
{
	status.text('Loading assets (2/3)...');
}
else if (loaded === 85)
{
	status.text('Loading assets (3/3)...');
}
else if (loaded === 92)
{
	status.text('Initializing...');
}
timeout = setTimeout(simulateLoading, 50);
	}
};

	// Start
	timeout = setTimeout(simulateLoading, 2000);
},
onClose: function()
{
	// Stop simulated loading if needed
	clearTimeout(timeout);
}
	});
};

	</script>
</body>
</html>